<template>
	<view class="city">
		<!-- <Header @back="back" left-icon="back" left-text="" right-text="" title="收银台" :bottom="true"></Header> -->

		<view class="cityTip">
			<view class="cityTipImg">
				<image style="height: 100%;width: 100%;margin-top: 10upx;margin-left: 20upx;" class="img" :src=mainConent.destinationImg></image>
			</view>
			<view class="cityTipRight">
				<view class="cityTipRightName">
					<view class="cityTipRightNameFir">
						{{mainConent.destinationName}}
					</view>
					<view class="cityTipRightNameSec color888">
						{{mainConent.destinationIntroduce}}
					</view>
				</view>
				<image style="height: 40upx;width: 20upx;margin: 80upx 20upx 0 0 ;" class="img" src="../../static/img/right.png"></image>
			</view>
		</view>
		<view class="cityTab">
			<view class=""  @click="goSence">
				<image style="height: 50upx;width: 50upx;" class="img" src="../../static/img/s4.png"></image>
				<view class="fs-20" style="margin-left: 5upx;">
					景区
				</view>
			</view>
			<view class=""   @click="goHotel">
				<image style="height: 50upx;width: 50upx;" class="img" src="../../static/img/s5.png"></image>
				<view class="fs-20" style="margin-left: 5upx;">
					酒店
				</view>
			</view>
			<view class="" @click="goRoute">
				<image style="height: 50upx;width: 50upx;" class="img" src="../../static/img/s6.png"></image>
				<view class="fs-20" style="margin-left: 5upx;">
					路线
				</view>
			</view>
			<view class=""  @click="goDelicious">
				<image style="height: 50upx;width: 50upx;" class="img" src="../../static/img/s7.png"></image>
				<view class="fs-20" style="margin-left: 5upx;">
					美食
				</view>
			</view>
			<view class=""   @click="goStrategy">
				<image style="height: 50upx;width: 50upx;" class="img" src="../../static/img/s8.png"></image>
				<view class="fs-20" style="margin-left: 5upx;">
					攻略
				</view>
			</view>
			
		</view>
		<view class="cityList">
			<view class="cityItem" v-for="item in cityList">
				<text class="scencetxt" style="font-weight: bold;">{{item.businessName}}</text>
				<view class="">
					<text class="" style="margin-right: 50upx;color: #888888;">精品路线</text>
					<image style="height: 20upx;width: 10upx;" class="img" src="../../static/img/right.png"></image>
				</view>
			</view>
		</view>
		<view class="noData" v-if="isNoData">
		
			<image src="../../static/img/bg_no_data.png" class="noDataImg"></image>
		
		</view>
	</view>
</template>

<script>
	import Header from '@/components/header.vue'
	export default {
		onLoad: function(option) {
			console.log(option, '==========');
			this.parentDate = JSON.parse(option.item)
		},
		data() {
			return {
				parentDate: '',
				cityList:[],
				mainConent:'',
				isNoData:false,
			}
		},
		components: {
			Header
		},
		onShow() {
			this.getDataList()
			this.getData()
		},
		methods: {
			//获取数据
			getData() {
				console.log(this.parentDate.name)
				console.log(this.$path.GET_DESTINATION_LIST)
				this.$postApi(this.$path.GET_DESTINATION_LIST, {
					destinationName:this.parentDate.name
				}).then(data => {
					if (data.data.success) {
						console.log(data,'1111')
						this.mainConent = data.data.rows[0]
					}
				})
			},
			//获取数据
			getDataList() {
				console.log(this.parentDate.name)
				this.$postApi(this.$path.GET_BUSINESS_LIST, {
					businessId: null, 
					businessName: null, 
					businessType: 0, 
					descType: 1, 
					addressCity: this.parentDate.name,
					page: 1,
					rows:5
				}).then(data => {
					if (data.data.success) {
						this.cityList = data.data.rows;
						console.log(this.cityList)
						this.cityList.length>0?this.isNoData =false:this.isNoData =true;
					}
				})
			},
			back() {
				uni.navigateBack({
					delta: 1
				});
			},
			goSence() {
				uni.navigateTo({
					url: '/pages/scence/scencelist?city=' + this.parentDate.name,
					animationType: 'pop-in',
					animationDuration: 200
				});
			},
			goHotel() {
				uni.navigateTo({
					url: '/pages/hotel/hotelquery?city=' + this.parentDate.name,
					animationType: 'pop-in',
					animationDuration: 200
				});
			},
			goRoute() {
				let items = {
					id: this.parentDate.id,
					name: this.parentDate.name,
				}
				uni.navigateTo({
					url:"/pages/route/routelist?city="+ this.parentDate.name,
					animationType: 'pop-in',
					animationDuration: 200
				});
			},
			goDelicious() {
				uni.navigateTo({
					url: '/pages/scenicOrder/deliciousIndex?city=' + this.parentDate.name,            
					animationType: 'pop-in',
					animationDuration: 200
				});
			},
			goStrategy() {
				uni.switchTab ({
					url: '/pages/strategy/strategy',
					animationType: 'pop-in',
					animationDuration: 200
				});
			},


		}
	}
</script>

<style lang="scss" scoped>
.cityTip{
	display: flex;
	margin: 34upx;
	background: rgba(255, 255, 255, 1);
	box-shadow: 0px 3px 20px 0px rgba(140, 140, 140, 0.26);
	border-radius: 10upx;
	height: 235upx;
	box-sizing: border-box;
	.cityTipImg{
		flex-shrink: 0;
		width: 252upx;
		height: 205upx;
	}
	.cityTipRight{
		display: flex;
		justify-content: space-between;
		width: 90%;
		.cityTipRightName{
			margin: 50upx 0 0 50upx;
		}
		.cityTipRightNameFir{
			font-size: 36upx;
			font-weight: bold;
			color: rgba(51, 51, 51, 1);
			margin: 20upx 0 15upx 0;
		}
	}
	
}
.cityTab{
		display: flex;
		justify-content: space-around;
	}
	.cityList{
		.cityItem{
			margin: 34upx;
			display: flex;
			justify-content: space-between;
			border-bottom: 1px solid #cccccc;
			padding: 50upx 0 50upx 0;
		}
	}
	.noData{
		margin-top: 100upx;
		height: 100%;
		width: 100%;
		display: flex;
		justify-content: center;
		align-items: center;
	}
</style>
